$(function () {

    $("body").on("click",".btn-primary",function () {
        saveBaseShare();
    }).on('click','#imgUpload',function () {
        var liLength = $('.base-share-list').find('li').length;
        if (liLength >= 7){
            icModale(0,"自定义背景图片最多上传3张");
            return;
        }
        initUpdateFileWin({
            fileType:'img',//文类类型["img","ico","xls","pdf","zip"]
            callback:'baseShareCallback',
            cut:false,//不开启剪切
            multiple: true
        });
    }).on('click','.imgDelete',function (e) {
        $(this).parents('li').remove();
    });


    //初始化海报切换按钮方法
    shareInputEvent();
    //初始化样式切换按钮方法
    styleInputEvent();

    /*var initSelectImg = $(".base-share-list input:checked");
    if(initSelectImg==null || initSelectImg.length ==0){
        var parentEm = $($(".base-share-list li")[0]);
        var url = parentEm.data('url');
        var type = parentEm.data('type');
        var selectStyle =parentEm.data('selectstyle');
        setPreview(url,type);
        setSelectStyle(selectStyle);
    }else{
        var parentEm = $($(initSelectImg[0]).parents('li')[0]);
        var url = parentEm.data('url');
        var type = parentEm.data('type');
        var selectStyle =parentEm.data('selectstyle');
        setPreview(url,type);
        setSelectStyle(selectStyle);
    }*/


    /**
     * 保存
     */
    function saveBaseShare() {
        var selectChannelList = $(".share-channel input:checked");
        var shareChannel = '';
        if(selectChannelList !=null && selectChannelList.length > 0){
            shareChannel = selectChannelList.map(function () {
                return this.value;
            }).get().join(",");
        }
        var imgList = $(".base-share-list").find('li');
        var imgObjList = new Array();
        $.each(imgList,function (index,img) {
            var imgObj = {};
            var url = $(img).data('url');
            var type = $(img).data('type');
            var selectStyle = $(img).data('selectstyle');
            console.log(selectStyle);
            var selected = 'N';
            var list = $(img).find('input[name=img]:checked');
            if(list!=null && list.length>0){
                selected = 'Y';
            }
            imgObj.index = index+'';
            imgObj.url = url;
            imgObj.type = type+'';
            imgObj.selected = selected;
            imgObj.selectStyle = selectStyle+'';
            imgObjList.push(imgObj);
        });
        var params = {};
        params.id = $("#baseShareId").val();
        params.shareChannel = shareChannel;
        params.urlMap = JSON.stringify(imgObjList);
        $.ajax({
            url: baseloaction + '/admin/marketing/saveBaseShare',
            type:'post',
            dataType:'json',
            contentType:'application/json;charset=utf-8',
            data:JSON.stringify(params),
            success:function (result) {
                icModale(0,result.message);
            },
            error:function (error) {
                icModale(0,'系统错误，海报数据保存失败');
            }
        });
    }

});

/**
 * 海报图片上传后的回调
 * @param data
 */
var counts = 0
function baseShareCallback(data){
    var img = new Image();
    img.src = data.url;
    img.onload = function () {
        if (750 > img.width || 1334 > img.height){
            icModale(0,'请上传宽高尺寸为750*1334的图片');
        }else{
            var li = '<li class="col-lg-2 col-md-3 col-xs-3" data-url="'+data.url+'" data-type=2 data-selectStyle=1>' +
                '                                                <span class="imgDelete" title="删除" style="position: absolute;top: 0;right: 0;">' +
                '                                                   <button type="button" class="close">' +
                '                                                       <span aria-hidden="true">×</span>' +
                '                                                   </button>' +
                '                                                </span>' +
                '                                                <label class="text-center">' +
                '                                                    <div class="file-box">' +
                '                                                        <div class="file">' +
                '                                                            <img id="user-defined-img" crossorigin="anonymous" src="'+data.url+'" width="100%" alt="自定义背景缩略图">' +
                '                                                            <p class="m-t-sm">' +
                '                                                                <span class="fs12 c-999" >自定义背景</span>' +
                '                                                            </p>' +
                '                                                            <p class="m-t-sm">' +
                '                                                               <input type="radio" name="img"/>'+
                '                                                            </p>' +
                '                                                         </div>' +
                '                                                    </div>' +
                '                                                </label>' +
                '                                            </li>';
            $('.base-share-list').append(li);
            //初始化拼接的input标签样式
            checksFun();
            //图片上传完成后初始化切换方法
            shareInputEvent();

            styleInputEvent();
        }
    }
    img.onerror = function (err) {
        console.log(err)
        if (counts < 3) {
            baseShareCallback(data)
        }
        counts++
    }
}

/**
 * 设置预览显示背景
 */
function setPreview(url,type) {
    if(type==1){
        $(".bs-poster-review__wrap>section").css('background-image',"url("+staticPath+url+")");
    }else{
        $(".bs-poster-review__wrap>section").css('background-image',"url("+url+")");
    }
}

/**
 * 设置预览显示样式
 * @param selecStyle
 */
function setSelectStyle(selectStyle) {
    if (selectStyle == 1) {
        $('.bs-poster-card__wrap').addClass('bs-poster-card-style-1');
        $('.bs-poster-card__wrap').removeClass('bs-poster-card-style-2');
    }
    if(selectStyle == 2){
        $('.bs-poster-card__wrap').addClass('bs-poster-card-style-2');
        $('.bs-poster-card__wrap').removeClass('bs-poster-card-style-1');
    }
}

function styleInputEvent(){
    //点击样式按钮切换预览区样式
    $('.select-style-list').find('input:radio').on('ifChecked',function () {
        var selectVal = $(this).val();
         $(".base-share-list").find('input:checked').parents('li').attr('data-selectstyle',selectVal)
        setSelectStyle(selectVal);
    });
}

function shareInputEvent(){
    //点击背景图时预览区样式背景
    $(".base-share-list").find('input:radio').on('ifChecked',function () {

        var parentEm = $(this).parents('li');
        var selectStyle = $(parentEm)[0].dataset.selectstyle;
        if (selectStyle == 1){
            $($('.select-style-list').find('input:radio')[0]).iCheck('check');
        } else if(selectStyle == 2) {
            $($('.select-style-list').find('input:radio')[1]).iCheck('check');
        }

        var url = parentEm.data('url');
        var type = parentEm.data('type');
        setPreview(url,type);
        setSelectStyle(selectStyle);
    });
}
